<!DOCTYPE html>
<html class="no-js" lang="zh_CN">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
    <title>${system_admin_title}</title>#required_css
</head>

<body>
#loading


<div class="app $!layout">
    <!-- 头部菜单 -->
    #header
    <section class="layout">
        <!-- 菜单 -->
        #sidebar
        <!-- 内容主体 -->
        <section class="container">
            <section class="main-content">
                <div class="content-wrap">
                    <div class="wrapper">
                        <div class="row clearfix">
                            <div class="col-md-12 column">
                                <h3>短信接口设置(HTTP)</h3>
                                <hr>
                                <form class="form-horizontal parsley-form" role="form" id="smsForm" data-parsley-validate action="$!basePath/system/sms/save" method="post">
                                    <input type="hidden" id="isTest" name="isTest" value="false"/>
                                    <input type="hidden" id="mobile2" name="mobile2"/>
                                    <div class="col-lg-12 col-md-12">
                                        <div class="form-group">
                                            <label for="url" class="col-sm-1 control-label">URL <span class="text-danger">*</span></label>
                                            <div class="col-sm-8">
                                                <input type="text" name="url" class="form-control" id="url" data-parsley-required="true" value="$!url"/>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-4 col-md-4">
                                        <div class="form-group">
                                            <label for="method" class="col-sm-3 control-label">请求方式</label>
                                            <div class="col-sm-6">
                                                <select name="method" id="method" class="form-control chosen">
                                                    <option value="POST" #if($!method=="POST")selected#end>POST</option>
                                                    <option value="GET" #if($!method=="GET")selected#end>GET</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-6 col-md-6">
                                        <div class="form-group">
                                            <label for="encoding" class="col-sm-2 control-label">编码方式</label>
                                            <div class="col-sm-4">
                                                <select name="encoding" id="encoding" class="form-control chosen">
                                                    <option value="UTF-8" #if($!encoding=="UTF-8")selected#end>UTF-8</option>
                                                    <option value="GBK" #if($!encoding=="GBK")selected#end>GBK</option>
                                                    <option value="GB2312" #if($!encoding=="GB2312")selected#end>GB2312</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-4 col-md-4">
                                        <div class="form-group">
                                            <label for="param0" class="col-sm-3 control-label">手机号码参数名 <span class="text-danger">*</span></label>
                                            <div class="col-sm-6">
                                                <input type="text" name="mobile" class="form-control" id="param0" data-parsley-required="true" value="$!mobile"/>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-6 col-md-6">
                                        <div class="form-group">
                                            <label for="param0" class="col-sm-2 control-label">短信内容参数名 <span class="text-danger">*</span></label>
                                            <div class="col-sm-4">
                                                <input type="text" name="content" class="form-control" id="param0" data-parsley-required="true" value="$!content"/>
                                            </div>
                                        </div>
                                    </div>
                                    #if($!params.size() == 0)
                                    <div id="firstParam" class="col-lg-12 col-md-12">
                                        <div class="form-group">
                                            <label for="param0" class="col-sm-1 control-label">其他参数列表</label>
                                            <div class="col-sm-3">
                                                <input type="text" name="paramName" class="form-control" id="param0"/>
                                            </div>
                                            <div class="col-sm-1 text-center pt8">=</div>
                                            <div class="col-sm-3">
                                                <input type="text" name="paramValue" class="form-control" id="param0"/>
                                            </div>
                                            <div class="col-sm-1 text-right">
                                                <button class="btn btn-default" type="button" onclick="addParam()">
                                                    <i class="fa fa-plus"></i>
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                    #else
                                    #foreach($!obj in $!params.entrySet())
                                    #if($!velocityCount == 1)
                                    <div id="firstParam" class="col-lg-12 col-md-12">
                                        <div class="form-group">
                                            <label for="param0" class="col-sm-1 control-label">其他参数列表</label>
                                            <div class="col-sm-3">
                                                <input type="text" name="paramName" class="form-control" id="param0" value="$!obj.key"/>
                                            </div>
                                            <div class="col-sm-1 text-center pt8">=</div>
                                            <div class="col-sm-3">
                                                <input type="text" name="paramValue" class="form-control" id="param0" value="$!obj.value"/>
                                            </div>
                                            <div class="col-sm-1 text-right">
                                                <button class="btn btn-default" type="button" onclick="addParam()">
                                                    <i class="fa fa-plus"></i>
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                    #else
                                    <div class="col-lg-12 col-md-12">
                                        <div class="form-group">
                                            <label for="param0" class="col-sm-1 control-label"></label>
                                            <div class="col-sm-3">
                                                <input type="text" name="paramName" class="form-control" id="param0" value="$!obj.key"/>
                                            </div>
                                            <div class="col-sm-1 text-center pt8">=</div>
                                            <div class="col-sm-3">
                                                <input type="text" name="paramValue" class="form-control" id="param0" value="$!obj.value"/>
                                            </div>
                                            <div class="col-sm-1 text-right">
                                                <button class="btn btn-danger" type="button" onclick="removeParam(this)">
                                                    <i class="fa fa-close"></i>
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                    #end
                                    #end
                                    #end
                                    <div id="template" class="col-lg-12 col-md-12 hide">
                                        <div class="form-group">
                                            <label for="param0" class="col-sm-2 control-label"></label>
                                            <div class="col-sm-3">
                                                <input type="text" name="paramName" class="form-control" id="param0"/>
                                            </div>
                                            <div class="col-sm-1 text-center pt8">=</div>
                                            <div class="col-sm-3">
                                                <input type="text" name="paramValue" class="form-control" id="param0"/>
                                            </div>
                                            <div class="col-sm-1 text-right">
                                                <button class="btn btn-danger" type="button" onclick="removeParam(this)">
                                                    <i class="fa fa-close"></i>
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-6 col-md-6 text-right">
                                        <div class="form-group">
                                            <div>
                                                <button class="btn btn-primary btn-parsley" type="submit" data-loading-text="正在保存...">保存设置
                                                </button>
                                                <button id="btnTest" class="btn btn-default btn-parsley" type="button" data-loading-text="正在测试..." onclick="doTest()">Test Conection
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                        <div id="responsePanel" class="panel hide">
                            <div class="panel-heading">服务器响应</div>
                            <div class="panel-body"></div>
                        </div>
                    </div>
                    <a class="exit-offscreen"></a>
                </div>
            </section>
        </section>
    </section>
</div>
#required_js
<!-- 本页面脚本 -->
<script src="$!basePath/framework/js/form/form.js"></script>
<script src="$!basePath/framework/js/view/toast.js"></script>
<script src="$!resPath/framework/js/form/select.js"></script>
<script src="$!basePath/framework/js/form/validator.js"></script>
<script src="$!basePath/framework/js/view/filebrowser.js"></script>
<script src="$!basePath/framework/js/form/uploader.js"></script>
<script type="text/javascript">
    $(function () {
        $("#smsForm").ajaxForm({
            beforeSubmit: function (arr, $form, options) {
                if ($("#smsForm #isTest").val() == "true") {
                    $form.find("#btnTest").button("loading");
                } else {
                    $form.find("button:submit").button("loading");
                }
            },
            success: function (data, statusText, xhr, $form) {
                if (data.success == true) {
                    if (data.isTest) {
                        $("#responsePanel").removeClass("hide");
                        $("#responsePanel .panel-body").html(data.response);
                    } else {
                        Toast.success("保存成功！");
                    }
                } else {
                    Toast.error(data.message);
                }
                $("#smsForm #isTest").val(false);
                $form.find("#btnTest").button("reset");
                $form.find("button:submit").button("reset");
            }
        });
    });

    function addParam() {
        var first = $("#firstParam");
        var template = $("#template");

        var template0 = template.clone();
        template0.removeClass("hide");
        template0.removeAttr("id");

        template.before(template0);
    }

    function removeParam(obj) {
        $(obj).parent().parent().parent().remove();
    }

    function doTest() {
        ns.tip.confirm("执行测试会消耗短信数量，确定要测试吗？", function () {
            ns.tip.prompt("请输入接收短信的手机号码：", function (mobile) {
                $("#smsForm #isTest").val(true);
                $("#smsForm #mobile2").val(mobile);
                $("#smsForm").submit();
            });
        });
    }
</script>
#loading_close
</body>
</html>